<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
	<div class="container" style="width: 960px;margin: auto;">
		<div class="row">
			<img src="img/logo.png.jpg"/>
		</div>
		<div class="row text-center">
			<h3>
				教师授课满意度问卷调查
			</h3>
		</div>
		<div class="row">
			<div class="col-md-12" style="text-align: right;">
				<small> 编号：XHQ-YNKM-QR-7.5-13</small>
			</div>
		</div>
		<div class="row">
			<div class="col-md-3">
				<div class="btn btn-group">
					<button type="button" class="btn btn-default">选择专业</button>
				  	<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
				    	<span class="caret"></span>
				    	<span class="sr-only">Toggle Dropdown</span>
				 	 </button>
				  	<ul class="dropdown-menu">
				   		<li><a href="#">Action</a></li>
				    	<li><a href="#">Another action</a></li>
				    	<li><a href="#">Something else here</a></li>
				    	<li role="separator" class="divider"></li>
				    	<li><a href="#">Separated link</a></li>
				  	</ul>
				</div>
			</div>
			<div class="col-md-3">
				<div class="btn btn-group">
					<button type="button" class="btn btn-default">选择课程</button>
				  	<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
				    	<span class="caret"></span>
				    	<span class="sr-only">Toggle Dropdown</span>
				 	 </button>
				  	<ul class="dropdown-menu">
				   		<li><a href="#">Action</a></li>
				    	<li><a href="#">Another action</a></li>
				    	<li><a href="#">Something else here</a></li>
				    	<li role="separator" class="divider"></li>
				    	<li><a href="#">Separated link</a></li>
				  	</ul>
				</div>
			</div>
			<div class="col-md-3">
				<div class="btn btn-group">
					<button type="button" class="btn btn-default">选择教师</button>
				  	<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
				    	<span class="caret"></span>
				    	<span class="sr-only">Toggle Dropdown</span>
				 	 </button>
				  	<ul class="dropdown-menu">
				   		<li><a href="#">Action</a></li>
				    	<li><a href="#">Another action</a></li>
				    	<li><a href="#">Something else here</a></li>
				    	<li role="separator" class="divider"></li>
				    	<li><a href="#">Separated link</a></li>
				  	</ul>
				</div>
			</div>
			<div class="col-md-3">
				<input type="text" name="date" id="date" value="2017-04-13" style="height: 48px;width: 133px;"/>
			</div>
		</div>
		<div class="row">
			<table class="table table-bordered">
				<tr>
					<th rowspan="3" style="vertical-align: middle;">序号</th>
					<th rowspan="3" style="vertical-align: middle;">调查项</th>
					<th rowspan="3" style="vertical-align: middle;">调查细节项目</th>
					<th colspan="5" style="text-align: center;">        满意度得分</th>
				</tr>
				<tr>
					<td>很满意</td>
					<td>满意</td>
					<td>一般</td>
					<td>不满意</td>
					<td>非常不满意</td>
				</tr>
				<tr>
					<td>5分</td>
					<td>4分</td>
					<td>3分</td>
					<td>2分</td>
					<td>1分</td>
				</tr>
			</table>
		</div>
		<div id="content" class="row">
			
		</div>
		<div class="row">
			<div class="col-md-1 btn btn-primary">
				提交
			</div>
			<div style="float: right;" class="col-md-1 btn btn-primary">
				重置
			</div>
		</div>
		<div class="row">
			<p>
				备注： 1.请在满意程度分项内选择一项打“√”； 2.本问卷属无记名打分，为进一步提高我院教学质量，检查教师授课水平、教学成效，请您本着公平、公正的态度认真、属实填写。3.本问卷不选默认5分。
			</p>
		</div>
	</div>
	
	
	<script type="text/javascript">
		$(document).ready(function(){
			$.ajax({
				type:"post",
				url:"getContents.do",
				async:true,
				success:function(data){
					var jsonObj=jQuery.parseJSON(data);
					html="<table class='table table-bordered'>";
						$.each(jsonObj, function(i,obj) {
							html+="<tr><td>"+obj.id+"</td><td>"+obj.item+"</td></tr>";
						});
						html+="</table>";
						$("#content").append(html);
				}
			});
		})
	</script>
</body>
</html>